/*
* © 2010 Autodata Solutions Company. All Rights Reserved
* This source code is the confidential and proprietary information of Autodata Solutions Company.
* The user shall not, in whole or in part, copy, publish, disclose or make any use of this source code
* without the prior written consent of Autodata Solutions Company.
*/
Ext.ns('net.autodata.compare.toolbar.PhotoSelectionToolbar');
(function() {
    var VFORMAT = net.autodata.compare.data.Format;
    
    /**
    * A customized Ext.Toolbar to allow selection of photos
    * @class PhotoWindow
    * @extends Ext.Window
    * @namespace net.autodata.compare
    */
    var Toolbar = Ext.extend(Ext.Toolbar, {
        cls: 'compare-photos-selection-toolbar',
        component: undefined,
        imageDescription: undefined,
        positionLabel: undefined,
        vehicleInfo: undefined,
        pagerTpl: '{index} of {total}',
        index: 0,
        total: 100,

        constructor: function(cfg) {
            cfg = cfg || {};
            Ext.apply(cfg, {
                prependButtons: true,
                displayInfo: false
            });

            Toolbar.superclass.constructor.call(this, cfg);
        },

        /**
        * @method init
        */
        init: function(window) {
            this.addEvents({
                /**
                * @event selectimage
                * Triggers when an image is selected
                * @param {net.autodata.compare.toolbar.PhotoSelectionToolbar} toolbar
                * @param {Integer} index
                */
                'selectimage': true
            });

            this.component = window;
            this.component.on('destroy', this.onDestroy);

            this.total = this.component.getRecords().getCount();

            if (this.vehicleInfo) {
                this.add({ 
                    xtype: 'tbtext', 
                    tpl: new Ext.XTemplate(
                        '<div class="vehicle-info">',
                            '{[this.ymmt(values)]}',
                            '<br/>',
                            '{[ASC.message(\'net.autodata.vehicle.msrp\')]} {[this.currency(values.msrp)]}',
                        '</div>', 
                        { 
                            compile: true,
                            disableFormats: true,
                            ymmt: function(values) {
                                return VFORMAT.ymmt(values);
                            },
                            currency: function(value) {
                                return value ? ASC.util.formatCurrency(value, 0) : '';
                            }		
                        }
                    ), 
                    data: this.vehicleInfo 
                });
            }

            this.addFill();

            this.addButton({ xtype: 'a-btn-toolbar', cls: 'x-btn-icon', iconCls: 'btn-prev-icon', tooltip: ASC.message('net.autodata.compare.toolbar.label.previous'), listeners: { 'click': this.onPrevButtonClick, scope: this} });

            this.positionLabel = new Ext.Toolbar.TextItem({ xtype: 'tbtext', tpl: this.pagerTpl, style: { maring: '0 0 2px 0' }, data: { index: this.index + 1, total: this.total} });
            this.add(this.positionLabel);

            this.addButton({ xtype: 'a-btn-toolbar', cls: 'x-btn-icon', iconCls:'btn-next-icon', tooltip: ASC.message('net.autodata.compare.toolbar.label.next'), listeners: { 'click': this.onNextButtonClick, scope: this} });
        },

        // Event Handlers

        /**
        * Next button on click event handler.
        * @method onNextButtonClick
        * @private
        */
        onNextButtonClick: function() {
            ++this.index;
            if (this.index > this.total - 1) {
                this.index = 0;
            }

            this.positionLabel.update({ index: this.index + 1, total: this.total });
            this.fireEvent('selectimage', this, this.index);
        },

        /**
        * Previous button on click event handler.
        * @method onNextButtonClick
        * @private
        */
        onPrevButtonClick: function() {
            --this.index;
            if (this.index < 0) {
                this.index = this.total - 1;
            }

            this.positionLabel.update({ index: this.index + 1, total: this.total });
            this.fireEvent('selectimage', this, this.index);
        },

        /**
        * Parent controls on destroy event handler.
        * @method onDestroy
        * @private
        */
        onDestroy: function() {
            this.removeAll();
            delete this.index;
            delete this.total;
            this.component.un('destroy', this.onDestroy);
        }
    });

    net.autodata.compare.toolbar.PhotoSelectionToolbar = Toolbar;
})();